<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>Document</title>
    <link rel="stylesheet" href="./css/common.css">
    <link rel="stylesheet" href="../node_modules/bootstrap/dist/css/bootstrap.css">
    <link rel="stylesheet" href="./css/personalData.css">
</head>

<body>
    <!-- 网页头部logo区域 -->
    <div class="warp">
        <div class="content">
            <div class="logo">
                <a href="" title="360个人中心"></a>
            </div>
            <div class="nav-login">
                <div class="shop-6360">
                    <a href="" title="360购物" target="_blank">
                        <img src="./images/personalData02.gif" alt="">
                    </a>
                </div>
                <ul>
                    <li>
                        <a href="" title="设置用户名" class="lnk">未设置用户名</a>&nbsp;&nbsp;&nbsp;
                        <a href="" title="退出个人中心" class="lnk sign-out">退出</a>
                    </li>
                    <li class="divider">|</li>
                    <li>
                        <a href="./index.html" title="360安全中心" target="_blank">360首页&gt;&gt;</a>
                    </li>
                </ul>
            </div>
        </div>
    </div>
    <!-- 导航栏 -->
    <div class="warp uc-nav">
        <div class="content nav">
            <ul class="mainnav">
                <li><a href="">首页</a></li>
                <li><a href="./personalPassword.html">帐号安全</a></li>
                <li><a href="">帐号信息</a></li>
                <li><a href="">帮助中心</a></li>
                <li><a href="">我的订单</a></li>
            </ul>
        </div>
    </div>
    <!-- 内容区域 -->
    <div class="warp clearfix">
        <div class="content">
            <div id="bd">
                <div class="aside fl">
                    <div class="u-info">
                        <div class="u-main clearFix">
                            <div class="avatar">
                                <a href="" class="avatar-img">
                                    <img src="https://p1.ssl.qhmsg.com/dm/110_110_100/t010b9103baca13e71b.jpg">
                                </a>
                                <a href="" class="change">修改头像</a>
                            </div>
                            <div class="txt">
                                <h2 title="用户名">用户名</h2>
                                <p>
                                    <a href="" class="lnk">修改昵称</a>
                                </p>
                            </div>
                        </div>
                        <div class="u-detail">
                            <h3>最近一次登录：</h3>
                        </div>
                    </div>
                    <div class="aside-mod">
                        <!-- <div class="aside-hd clearFix">
                            <h2>常用操作</h2>
                        </div>
                        <div class="aside-bd">
                            <ul class="operation-list">
                                <li>
                                    <h3>
                                        <i class="ico ico-psw"></i>
                                        登录密码
                                    </h3>
                                    <p>
                                        <span class="fr">
                                            <a href="" class="lnk">修改</a>
                                        </span>
                                        <span>定期修改密码，能提高帐号安全等级</span>
                                    </p>
                                </li>
                                <li>
                                    <h3>
                                        <i class="ico ico-psw"></i>
                                        登陆邮箱
                                    </h3>
                                    <p>
                                        <span class="fr">
                                            <a href="" class="lnk">设置</a>
                                        </span>
                                        <em class="orange">未设置</em>
                                    </p>
                                </li>
                                <li>
                                    <h3>
                                        <i class="ico ico-psw"></i>
                                        绑定手机：
                                    </h3>
                                    <p>
                                        <span class="fr">
                                            <a href="" class="lnk">修改</a>
                                        </span>
                                        <em class="orange">未绑定</em>
                                    </p>
                                </li>
                                <li>
                                    <h3>
                                        <i class="ico ico-psw"></i>
                                        账号卫士：
                                    </h3>
                                    <p>
                                        <span class="fr">
                                            <a href="" class="lnk">绑定</a>
                                        </span>
                                        <em class="orange">未绑定</em>
                                    </p>
                                </li>
                            </ul>
                        </div> -->
                        <div class="container">
                            <table class="table table-striped userData">
                                <tr class="username">
                                    <td>用户名：</td>
                                    <td>XX</td>
                                </tr>
                                <tr class="phone">
                                    <td>手机：</td>
                                    <td>XX</td>
                                </tr>
                                <tr class="email">
                                    <td>邮箱：</td>
                                    <td>XX</td>
                                </tr>
                                <tr class="age">
                                    <td>年龄：</td>
                                    <td>XX</td>
                                </tr>
                            </table>
                            <button class="btn btn-success update">修改</button>
                        </div>
                    </div>
                    <div class="aside-mod">
                        <div class="aside-hd clearFix">
                            <h2>快捷入口</h2>
                        </div>
                        <div class="aside-bd">
                            <ul class="entry-list">
                                <li>
                                    <a href="">
                                        <img src="./images/personalData04.png" alt="">
                                        <p>360购物</p>
                                    </a>
                                </li>
                            </ul>
                        </div>
                    </div>
                </div>
                <div class="article fr">
                    <!-- 安全评分 -->
                    <div class="art-mod">
                        <div class="art-hd clearFix">
                            <h2>安全评分</h2>
                        </div>
                        <div class="art-bd">
                            <div class="safety-rating">
                                <div class="safety">
                                    <span class="btn fr">立即修复</span>
                                    <h3>
                                        您的帐号安全评分：
                                        <em class="num">80</em>
                                        分
                                    </h3>
                                    <div class="progress-bar">
                                        <div class="per" style="width: 80%;"></div>
                                    </div>
                                    <p class="orange">您的帐号评分为80分，请继续保持</p>
                                </div>
                                <div class="rating-results">
                                    <p>
                                        <span class="fr">
                                            <a href="">立即绑定</a>
                                        </span>
                                        <i class="ico ico-err"></i>
                                        帐号只有一项密保工具&nbsp;&nbsp;
                                        <em class="gray">建议您设置两项密保工具便于找回密码</em>
                                    </p>
                                    <p>
                                        <span class="fr">
                                            <a href="">立即绑定</a>
                                        </span>
                                        <i class="ico ico-err"></i>
                                        密保工具已验证  &nbsp;&nbsp;
                                        <em class="gray">当您有密保不使用时，可以通过验证其他密保来修改</em>
                                    </p>
                                    <p>
                                        <span class="fr">
                                            <a href="" class="lnk">立即绑定</a>
                                        </span>
                                        <i class="ico ico-err"></i>
                                        帐号未绑定帐号卫士  &nbsp;&nbsp;
                                        <em class="gray">一站式管理帐号安全和快速登录360产品</em>
                                    </p>
                                </div>
                            </div>
                        </div>
                    </div>
                    <div class="art-mod">
                        <div class="art-hd clearFix">
                            <h2>登陆记录</h2>
                        </div>
                        <div class="art-bd mod-1">
                            <div class="no-record">
                                <h3>一条记录也没找到，您最近很少登录哦</h3>
                                <img src="./images/personalData05.png" alt="">
                            </div>
                        </div>
                    </div>
                </div>
            </div>
        </div>
    </div>
    <!-- 网页底部 -->
    <div class="warp">
        <div class="content" id="ft">
            <p>Copyright©2005-<span id="currentYear">2022</span> 360.CN All Rights Reserved 360安全中心</p>
            <p>隐私权政策 <a target="_blank"
                    href="http://www.beian.gov.cn/?sb_param=e6c1df953d5f9dfc511395a5aceb79fb">京ICP证080047号</a></p>
            <p><a style="color:#999;"
                    href="http://www.beian.gov.cn/portal/registerSystemInfo?recordcode=11000002000006&amp;sb_param=f3a7e9faccec8982f9a9259322fb385b"
                    target="_blank"><img class="wangan" src="https://p.ssl.qhimg.com/t018b891a688f560525.png">京公网安备
                    11000002000006号</a></p>
        </div>
    </div>
</body>
    <script src="../node_modules/jquery/dist/jquery.js"></script>
    <script src="../node_modules/layui-layer/dist/layer.js"></script>
    <script src="./js/utils.js"></script>
    <script src="./js/personalData.js"></script>
</html>